Skip to content
This repository was archived by the owner on Apr 17, 2019. It is now read-only.

Fix for complex options rendering and adds table->hideColumn() for hidden columns (like primary key)#264

Open
tblanchard wants to merge 5 commits intoChumper:masterfrom
tblanchard:master
Open

Fix for complex options rendering and adds table->hideColumn() for hidden columns (like primary key)#264
tblanchard wants to merge 5 commits intoChumper:masterfrom
tblanchard:master

Conversation

@tblanchard
Copy link

@tblanchard tblanchard commented Mar 20, 2015

This is a really great library - but I ran across two problems with it.

First, complex options rendering wasn't working properly. For instance, when using table tools which required a complicated bit of javascript to specify: eg

            oTable = jQuery('#jMlBQOLU').dataTable({
                "sPaginationType": "full_numbers",
                "bProcessing": false,
                "sAjaxSource": "/api/lots",
                "bServerSide": true,
                "dom": 'Tlfrtip',
                "pageLength": 100,
                "lengthChange": true,
                "lengthMenu": [10, 25, 50, 100, 250, 500, 1000],
                "tableTools": {
                    sRowSelect: "os",
                    sSwfPath: "/DataTables-1.10.4/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
                    "aButtons": [
                        {
                            sExtends: "text",
                            sButtonText: "Create",
                            fnClick: function () {
                                document.location.href = document.location.href + '/create';
                            }
                        },
                        {
                            sExtends: "text",
                            sButtonText: "Edit",
                            fnInit: enableButton,
                            fnSelect: enableButton
                        },
                        {
                            sExtends: "text",
                            sButtonText: "Spaces",
                            fnInit: enableButton,
                            fnSelect: enableButton
                        },
                        {
                            sExtends: "text",
                            sButtonText: "Remove",
                            fnInit: enableButton,
                            fnSelect: enableButton
                        }
                    ]
                }
            });

I found the tableTools structure not rendering properly for a variety of reasons - among them being a lack of recursion and no way to specify that a value was actually a javascript function name and shouldn't be quoted. I replace the template based rendering of the structure with a couple private recursive functions in Table itself and pass the fully rendered options string instead. I noticed that the original code would look for values starting with 'function' to guess if it were a javascript function that shouldn't be quoted. This is retained, however in my case I already had a javascript function I wanted to use as a callback. To fix this, I also added support for the javascript: uri scheme. Thus the above options looks like this in php now.

        $options = [
            "sPaginationType"=> "full_numbers",
            "bProcessing"=> false,
            "sAjaxSource"=> "/api/lots",
            "bServerSide"=> true,
            "dom"=> "Tlfrtip",
            "pageLength" => 100,
            "lengthChange"=> true,
            "lengthMenu"=> [ 10, 25, 50, 100, 250, 500, 1000 ],
            "tableTools"=> [
                "sRowSelect"=>"os",
                "sSwfPath"=> "/DataTables-1.10.4/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
                "aButtons"=>[
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Create",
                        "fnClick"=> "function() { document.location.href = document.location.href + '/create'; }"
                    ],
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Edit",
                        "fnInit"=> "javascript:enableButton",
                        "fnSelect"=> "javascript:enableButton"
                    ],
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Spaces",
                        "fnInit"=> "javascript:enableButton",
                        "fnSelect"=> "javascript:enableButton"
                    ],
                    [
                        "sExtends"=> "text",
                        "sButtonText"=> "Remove",
                        "fnInit"=> "function(b){window.enableButton.call(this,b);}",
                        "fnSelect"=> "function(b){window.enableButton.call(this,b);}"
                    ]
                ]
            ]
        ];

I left the callbacks on the "Remove" button in the old style - either form does a javascript call on the function with this bound to the table.

The second feature I added was the ability to provide hidden columns. Generally, I need the primary key of a record to do anything but I don't necessarily want to show it to the user. So I added hideColumn to Table. It works a bit like addColumn except the column must already exist. You can use the index, name or alias.

$table = $t = Datatable::table()
            ->noScript()
            ->addColumn('ID', 'Name', 'Address', 'Description')  // these are the column headings to be shown
            ->hideColumn('ID') // columns to hide
            ->setUrl(route('api.lots'))
            ->setOptions($options);

@tblanchard tblanchard mentioned this pull request Mar 20, 2015
Open
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@tblanchard